/**
 * @author zhangqiang
 * @data 2017/3/14
 *  地址列表
 * */
import React, {Component} from 'react'
import {connect} from 'react-redux'
import style from './index.scss'
import common from '../../../../../js/utils/common'
import {
    getAddAddressList,
    setDefaultAddress,
    currentAddress,
} from '../../actions/addAddressListActions'
import Address from '../../components/addressList'


class AddressList extends Component {
    constructor(props) {
        super(props);
        this.state = {
            type: localStorage.getItem('addressList_action') || 0, //默认选中
            addressList: [],
            isShow: true
        }
    }

    /**
     * 生命周期
     */
    componentWillMount() {
        this.getAddressList();
    }

    componentWillUnmount() {
        sessionStorage.setItem('getRegionType', 1);
        sessionStorage.setItem('focusAddressList', 1)
    }

    toUrl(url) {
        this.context.router.push(url);
    }

    checkFirstAddress() {
		this.toUrl('addAddress');
		localStorage.setItem('addressList_action',0)		
	}

    componentDidMount() {
        common.setViewTitle('选择收件地址');
    }

    //获得地址列表
    getAddressList(index) {
        this.props.dispatch(getAddAddressList({}, (data) => {
            this.setState({
                addressList: data.addressMsgList,
                isShow: false
            })
        }))
        if(index == -1){
			this.setState({
				type: index
			})
		}
    }

    //选择的默认地址
    getDataFUN(index, id, opt) {
        //opt default 设置默认地址
        // choice  选择的地址

        if (opt == 'choice') {
            this.props.dispatch(currentAddress(this.state.addressList[index]));
            window.history.go(-1);
            return
        } else {
            let postData = {  //设置默认地址接口
                id: id
            }
            this.props.dispatch(setDefaultAddress(postData, (res) => {
            }));
            this.setState({
                type: index,
            });
            if(index == 0){
				localStorage.setItem('addressList_action',0)
			}
        }
    }

    //构建地址列表
    structAddressList() {
        return this.state.addressList.map((item, i) =>
            <Address key={i}
                     index={i}
                     fn={this.state.type}
                     id={item.id}
                     contactName={item.contactName}
                     cellNum={item.cellNum}
                     onClick={(index) => {
                         this.getAddressList(index)
                     }}
                     countyName={item.countyName ? item.countyName : ''}
                     street={item.street}
                     addr={item.provinceName + item.cityName}
                     onType={(i, id, opt) => this.getDataFUN(i, id, opt)}
            />
        )
    }

    /*
    组件
    */
    render() {

        return (
            <div>
                <div className={style.addAddress_List}>
                    {
                        this.state.isShow ?
                            <div className={style.load}>加载中......</div> : this.state.addressList.length ?
                            <div>
                                <div style={{height: '.24rem', background: '#f2f2f2'}}></div>
                                {this.structAddressList()}
                                <div style={{height: '.2rem', background: '#f2f2f2'}}></div>
                                <div className={style.addAddress} onClick={() => {
                                    this.toUrl('addAddress')
                                }}>
                                    <img src="./images/to_add.png" alt=""/>
                                    添加新地址
                                </div>
                            </div> :
                            <div className={style.noData}>
                                <div className={style.voidBox}>
                                    <img className={style.noDataImg} src="./images/noAddress.png" alt=""/>
                                    <p>暂无收件地址</p>
                                </div>
                                <div className={style.btnBox}>
                                    <button onClick={() => {
                                        this.checkFirstAddress()
                                    }}><img src="./images/noDataAdd.png" alt=""/>添加新地址
                                    </button>
                                </div>
                            </div>
                    }
                </div>
            </div>
        )
    }
}

//使用context
AddressList.contextTypes = {
    router: React.PropTypes.object.isRequired
};

AddressList.defaultProps = {
    addressList: []
};

function mapStateToProps(state) {
    return Object.assign({}, state.addressList);
}

export default connect(mapStateToProps)(AddressList)